// 导入用来创建路由和确定路由模式的两个方法
import {createRouter, createWebHistory} from 'vue-router';
import store from "@/store";
import storage from "@/util/storage";
import {STORAGE_LOGIN_USER} from "@/util/const";


/**
 * 定义路由信息
 *
 */
const routes = [
    {
        path: "/",
        redirect: {name: "login"}
    },
    {
        name: "login",
        path: "/login",
        component: () => import("@/components/login/LoginIndex.vue")
    },
    {
        name: "main",
        path: "/main",
        component: () => import("@/components/main/MainIndex.vue"),
        children:[
            {
                name:"user",
                path:"/user",
                component:()=>import("@/components/system/user/UserIndex.vue")
            }
        ]
    },
]

// 创建路由实例并传递 `routes` 配置
// 我们在这里使用 html5 的路由模式，url中不带有#，部署项目的时候需要注意。
const router = createRouter({
    history: createWebHistory(),
    routes,
})


// 全局的路由守卫
router.beforeEach((to) => {
    console.log(to);

    // 如果路由的是登录就放行
    if (to.name === "login") return true;

    // 如果store中没有
    if (!store.getters.isLogin) {
        // 判断storage中是否有数据，如果有恢复到store中放行
        const loginUser = storage.getSessionObject(STORAGE_LOGIN_USER);
        if (loginUser) {
            // 恢复token等用户信息
            store.dispatch({type: "RECOVER_USER"});
            // 恢复perms等鉴权信息
            store.dispatch({type:"GET_INFO"});
        } else {
            router.push({name: "login"});
            return false;
        }
    }

    // 如果store中有token和userName的话，放行
    return true;
})

// 将路由实例导出
export default router